<template>
  <TbTitle level="2" title="(三) 、本年度国际交流与合作情况" />
  <TbTitle level="3" title="(1) 、参加国际会议和出访情况" />
  <table border="0" class="m-table-pdf">
    <tr>
      <td rowspan="2">本年度参加国际会议情况</td>
      <td rowspan="2" colspan="2">
        共计参加
        {{ internationalExchange.hostNum }}
        次，其中，
      </td>
      <td>主办（联合主办）</td>
      <td>承办（联合承办）</td>
      <td>参与</td>
    </tr>
    <tr>
      <td>
        {{ internationalExchange.hostNum }}
        次
      </td>
      <td>
        {{ internationalExchange.undertakingNum }}
        次
      </td>
      <td>
        {{ internationalExchange.participateNum }}
        次
      </td>
    </tr>
    <tr>
      <td>本年度出国（境）情况</td>
      <td colspan="5">
        组织或者参与出访团组共计
        {{ internationalExchange.participateVisiting }}
        个，本单位共计
        {{ internationalExchange.participateUnit }}
        人次出访。
      </td>
    </tr>
  </table>
  <TbTitle level="3" title="（2）、在境外设立机构情况" />
  <el-table size="mini" :header-cell-style="{ background: '#f0f7fc', color: '#000' }" :data="overseasList" border>
    <el-table-column type="index" align="center" width="70" label="序号">
    </el-table-column>
    <el-table-column prop="institutionName" align="center" label="机构名称">
    </el-table-column>
    <el-table-column prop="institutionCountry" align="center" label="所在国家(地区)">
      <template v-slot="scope">
        {{ dictToVal(dict2, scope.row.institutionCountry) }}
      </template>
    </el-table-column>
    <el-table-column prop="institutionType" align="center" label="机构类型">
      <template v-slot="scope">
        {{ dictToVal(dict1, scope.row.institutionType) }}
      </template>
    </el-table-column>
    <el-table-column prop="establishTime" align="center" label="设立时间">
    </el-table-column>
    <el-table-column prop="responsible" align="center" label="负责人">
    </el-table-column>
    <el-table-column prop="expatriatesNum" align="center" label="外派工作人数">
    </el-table-column>
  </el-table>
  <div class="msg-tip">
    注：
    <p>
      1、本栏目统计本单位截止{{ examineYear }}年年底建立的所有境外机构。
    </p>
  </div>
</template>
<script setup lang="ts">
import { ref, reactive, inject } from 'vue'
import TbTitle from '@/views/yearCheck/components/TbTitle.vue'

import { getDictOrgType, getDictCountry } from '@/api/dict/index'

let internationalExchange = reactive({})
let overseasList = ref([])
const dict1 = ref([])
const dict2 = ref([])
const examineYear = ref()
const { getDetailInfo } = inject('getDetailInfo')

getDetailInfo(10).then(res => {
  internationalExchange = res.data.internationalExchange
  overseasList.value = res.data.overseasList
  examineYear.value = res.examineYear
})


let getDictInfo = () => {
  //机构类型
  getDictOrgType().then(res => {
    dict1.value = res.data
  })
  //所在国家
  getDictCountry().then(res => {
    dict2.value = res.data
  })
}
getDictInfo()

const dictToVal = (dictList, val) => {
  for (let i = 0; i < dictList.length; i++) {
    if (val == dictList[i].id) {
      return dictList[i].name
    }
  }
}
</script>
<style lang="scss" scoped>
.msg-tip {
  padding: 20px 0;
  color: #000;

  font-family: '微软雅黑';
}
</style>
